<template>
        <div class="contract-add-edit">
                <div class="steps">
                        <div class="stepbtn" :class=" active==1? 'on' : '' " @click="active=1" style="cursor:pointer">合同签约信息</div>
                        <div class="stepbtn" :class=" active==2? 'on' : '' " @click="active=2" style="cursor:pointer">合同费用及履约</div>
                        <div class="stepbtn" :class=" active==3? 'on' : '' " @click="active=3" style="cursor:pointer">合同文本及附件</div>
                </div>
               <el-form ref="ruleForm" :inline="true" :model="ruleFormParam" class="demo-form-inline" v-if="active==1" :rules="rules">
                       <div class="title">合同基本信息</div>
                       <div class="contract-item">
                               <el-form-item label="合同名称：" label-width="180px" prop="contractName">
                                       <el-input :disabled="type=='look'" v-model="ruleFormParam.contractName" placeholder="请输入合同名称" style="width:534px;" maxlength="50"></el-input>
                               </el-form-item>
                               <el-form-item label="合同编号：" label-width="180px" class="commonclass">
                                       <el-input  disabled style="width:217px;" v-model="ruleFormParam.contractCode"></el-input>
                               </el-form-item>
                       </div>
                       <div class="contract-item">
                               <el-form-item label="合同类型："  label-width="180px" prop="contractType">
                                       <el-select v-model="ruleFormParam.contractType" :disabled="type=='look'">
                                               <el-option v-for="item in contractcategorys" :key="item.code" :label="item.value" :value="item.code"></el-option>
                                       </el-select>
                               </el-form-item>
                               <el-form-item label="收支类别：" label-width="180px" prop="budgetType">
                                       <el-select v-model="ruleFormParam.budgetType"  :disabled="type=='look'" >
                                               <el-option v-for="item in budgetcategorys" :key="item.code" :label="item.value" :value="item.code"></el-option>
                                       </el-select>
                               </el-form-item>
                       </div>
                       <div class="contract-item">
                               <el-form-item label="合同性质："  label-width="180px" prop="contractNature">
                                       <el-select v-model="ruleFormParam.contractNature" :disabled="type=='look'" >
                                               <el-option v-for="item in contractnatures" :key="item.code" :label="item.value" :value="item.code"></el-option>
                                       </el-select>
                               </el-form-item>
                               <el-form-item label="合同截止日期：" label-width="180px" prop="contractEndTime">
                                       <el-date-picker
                                            v-model="ruleFormParam.contractEndTime"
                                            type="date"
                                            value-format="yyyy-MM-dd"
                                            placeholder="请选择合同截止日期"  :disabled="type=='look'">
                                    </el-date-picker>
                               </el-form-item>
                       </div>
                       <div class="contract-item">
                               <el-form-item label="合同归属城市："  label-width="180px" prop="contractProvince">
                                       <!-- <el-select v-model="ruleFormParam.contractProvince" @change="loadCity" :disabled="type=='look'">
                                               <el-option v-for="item in provinces" :key="item.provinceid" :label="item.province" :value="item.provinceid"></el-option>
                                       </el-select> -->
                                       <el-input v-model="contractProvinceName" disabled></el-input>
                               </el-form-item>
                               <el-form-item label=""  label-width="180px">
                                       <!-- <el-select v-model="ruleFormParam.contractCity"  label-width="180px" :disabled="type=='look'">
                                               <el-option v-for="item in citys" :key="item.city" :label="item.cityId" :value="item.city"></el-option>
                                       </el-select> -->
                                       <el-input v-model="contractCityName" disabled></el-input>
                               </el-form-item>
                       </div>
                       <div class="title">合同概述及关键条款信息</div>
                       <div class="contract-item">
                               <el-form-item label="合同概述：" class="inputtextarea" prop="contractSummary">
                                       <el-input :disabled="type=='look'" type="textarea"  :rows="4"  :placeholder="placeHoldcontractSummary"  v-model.trim="ruleFormParam.contractSummary" maxlength="500"></el-input>
                               </el-form-item>
                       </div>
                       <div class="contract-item">
                               <el-form-item label="关键条款：" class="inputtextarea" prop="contractProvisions">
                                       <el-input :disabled="type=='look'" type="textarea"  :rows="4"  :placeholder="placeHoldcontractProvisions"  v-model.trim="ruleFormParam.contractProvisions" maxlength="500"></el-input>
                               </el-form-item>
                       </div>
                       <div v-for="(item,index) in ruleFormParam.partiesList" :key="index" class="contractBody">
                               <div class="title">签约方信息</div>
                               <div class="contract-item">
                                       <el-form-item label="签约方类别：" label-width="180px"  class="commonclass">
                                               <el-select v-model="item.partiesType"  label-width="180px" :disabled="type=='look'">
                                                       <el-option v-for="item in contractingcategorys" :key="item.code" :label="item.value" :value="item.code"></el-option>
                                               </el-select>
                                       </el-form-item>
                                       <el-form-item label="签约方数据源：" label-width="180px" style="margin-left:150px;" class="commonclass">
                                               <el-select v-model="item.partiesSource"  label-width="180px"  :disabled="type=='look'">
                                                       <el-option v-for="item in contractPartyresources" :key="item.code" :label="item.value" :value="item.code"></el-option>
                                               </el-select>
                                       </el-form-item>
                               </div>
                               <div class="contract-item">
                                       <el-form-item label="公司/个人名称：" label-width="180px" class="commonclass">
                                              <el-input v-model="item.companyName" disabled style="width:217px;"></el-input>
                                              <el-button type="primary" style="margin-left:-3.5px;"  v-if="type !=='look'">选择</el-button>
                                       </el-form-item>
                                       <el-form-item label="开户行：" label-width="180px" style="margin-left:79px;" class="commonclass">
                                              <el-input v-model="item.openingBank" disabled style="width:217px;"></el-input>
                                              <el-button type="primary" style="margin-left:-3.5px;" :disabled="item.partiesSource != 0" v-if="type !=='look'" >选择</el-button>
                                       </el-form-item>
                               </div>
                               <div class="contract-item">
                                       <el-form-item label="法定代表人：" label-width="180px" class="commonclass">
                                               <el-input v-model="item.lawperson" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                                       <el-form-item label="开户行名称：" label-width="180px" style="margin-left:150px;" class="commonclass">
                                                <el-input v-model="item.bankName" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                               </div>
                               <div class="contract-item">
                                       <el-form-item label="纳税人识别号/身份证号：" label-width="180px" class="commonclass">
                                               <el-input v-model="item.idCard" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                                       <el-form-item label="银行账号：" label-width="180px" style="margin-left:150px;" class="commonclass">
                                                <el-input v-model="item.openbankNum" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                               </div>
                               <div class="contract-item">
                                       <el-form-item label="联行号：" label-width="180px" class="commonclass">
                                               <el-input v-model="item.lineNum" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                                       <el-form-item label="地区代码信息：" label-width="180px" style="margin-left:150px;" class="commonclass">
                                                <el-input v-model="item.districtInfo" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                               </div>
                               <div class="contract-item">
                                       <el-form-item label="开户行所属省：" label-width="180px" class="commonclass">
                                               <el-input v-model="item.openBankprovince" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                                       <el-form-item label="公司地址：" label-width="180px" style="margin-left:150px;" class="commonclass">
                                                <el-input v-model="item.companyDistrict" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                               </div>
                               <div class="contract-item">
                                       <el-form-item label="开户行所属市：" label-width="180px" class="commonclass">
                                               <el-input v-model="item.openBankcity" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                                       <el-form-item label="联系电话：" label-width="180px" style="margin-left:150px;" class="commonclass">
                                                <el-input v-model="item.contacttel" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                               </div>
                               <div class="contract-item">
                                       <el-form-item label="邮政编码：" label-width="180px">
                                               <el-input v-model="item.postCode" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                                       <el-form-item label="用途：" label-width="180px" style="margin-left:150px;" class="commonclass">
                                                <el-input v-model="item.purpose" disabled style="width:217px;"></el-input>
                                       </el-form-item>
                               </div>
                               <el-button type="primary" class="del" v-if="ruleFormParam.partiesList.length>1 && type != 'look' ">删除</el-button>
                       </div>
                       <el-button type="primary" v-if="type !=='look'">增加签约方</el-button>
                       <div class="title">项目和经办信息</div>
                       <div class="contract-item">
                               <el-form-item label="项目名称：" label-width="180px" :class="(ruleFormParam.contractType==100002 && ruleFormParam.contractNature==0) ? '' : 'commonclass'">
                                      <el-input v-model="ruleFormParam.projectId" disabled style="width:217px;display:none;" placeholder="请选择项目名称" ></el-input>
                                      <el-input v-model="nameproject" disabled style="width:217px;" placeholder="请选择项目名称"></el-input>
                                      <el-button type="primary" :disabled=" (ruleFormParam.contractType==100002 && ruleFormParam.contractNature==0)" style="margin-left:-3.5px;" @click="openChoseCooproject" v-if="type !=='look' ">选择</el-button>
                               </el-form-item>
                       </div>
                       <div class="contract-item">
                               <el-form-item label="经办人姓名：" label-width="180px" prop="contractOperatorName">
                                      <el-input v-model="ruleFormParam.contractOperatorName" disabled style="width:217px;" placeholder="请选择经办人"></el-input>
                                      <el-button type="primary" style="margin-left:-3.5px;"  v-if="type !=='look'">选择</el-button>
                               </el-form-item>
                               <el-form-item label="联系电话：" label-width="180px" prop="contractOperatorPhone">
                                      <el-input :disabled="type=='look'" v-model="ruleFormParam.contractOperatorPhone" style="width:217px;" placeholder="请输入联系电话" maxlength="11"></el-input>
                               </el-form-item>
                       </div>
                       <div class="contract-item">
                               <el-form-item label="是否使用合同范本：" label-width="180px" prop="templateFlag">
                                       <el-select v-model="ruleFormParam.templateFlag"  label-width="180px" :disabled="type =='look'" >
                                               <el-option v-for="(item,index) in contractTemplates" :key="index" :label="item.label" :value="item.value"></el-option>
                                       </el-select>
                               </el-form-item>
                       </div>
                       <div class="contract-item">
                               <el-form-item label="请勾选要调用的合同范本：" label-width="190px" v-if="ruleFormParam.templateFlag==0" class="commonclass">
                                        <el-checkbox-group v-model="ruleFormParam.templateIds" :disabled="type =='look'">
                                                <el-checkbox v-for="item in callModels" :label="item.templateId" :key="item.templateId">{{item.templateName}}
                                                         <a :href="item.templateEnclosure" style="text-decoration:none;">下载</a>
                                                 </el-checkbox>

                                        </el-checkbox-group>
                               </el-form-item>
                               <el-form-item label="不用合同范本的原因：" class="inputtextarea commonclass" label-width="180px" v-if="ruleFormParam.templateFlag==1" >
                                       <el-input type="textarea" :disabled="type =='look'"  :rows="4"  placeholder="请输入原因"  v-model.trim="ruleFormParam.templateReason"></el-input>
                               </el-form-item>
                       </div>
                       <div class="contract-item">
                               <el-form-item label="备注：" class="inputtextarea" label-width="180px" >
                                       <el-input type="textarea" :disabled="type =='look'"  :rows="4"  placeholder="请输入备注"  v-model="ruleFormParam.remarks" maxlength="100"></el-input>
                               </el-form-item>
                               <el-form-item label="作废原因：" class="inputtextarea" label-width="180px" v-if="type =='look'">
                                       <el-input type="textarea" :disabled="type =='look'"  :rows="4"   v-model="ruleFormParam.discardReason" maxlength="100"></el-input>
                               </el-form-item>
                       </div>
                       <div style="text-align:center;">
                               <el-button type="primary" @click="firstNext">下一步</el-button>
                       </div>
               </el-form>
               <el-form ref="ruleForm1" :inline="true" :model="ruleFormParam1" class="demo-form-inline" v-if="active==2" >
                       <div class="title">合同费用信息</div>
                       <div class="contract-item">
                               <el-form-item label="含税金额（元）：" label-width="180px">
                                       <el-input :disabled="type=='look'" v-model="ruleFormParam1.contractAmountStr" placeholder="请输入含税金额" style="width:217px;" ></el-input>
                               </el-form-item>
                               <el-form-item label="税率（%）：" label-width="180px" >
                                       <el-input :disabled="type=='look'" v-model="ruleFormParam1.taxRateStr"  style="width:217px;" placeholder="请输入税率" ></el-input>
                               </el-form-item>
                       </div>
                       <div class="contract-item">
                               <el-form-item label="税金（元）：" label-width="180px">
                                       <el-input :disabled="type=='look'" v-model="ruleFormParam1.taxAmountStr" disabled  style="width:217px;"></el-input>
                               </el-form-item>
                               <el-form-item label="不含税金额（元）：" label-width="180px">
                                       <el-input :disabled="type=='look'" v-model="ruleFormParam1.accountsPayableStr" disabled style="width:217px;" ></el-input>
                               </el-form-item>
                       </div>
                       <div v-for="(item,index) in ruleFormParam1.planRequests"  class="contractBody">
                               <div class="title">合同履约计划</div>
                               <div class="contract-item">
                                       <el-form-item label="节点名称：" label-width="180px">
                                               <el-input :disabled="type=='look'" v-model="item.nodeName" placeholder="请输入节点名称" style="width:217px;" ></el-input>
                                       </el-form-item>
                                       <el-form-item label="百分比（%）：" label-width="180px" >
                                               <el-input :disabled="type=='look'" v-model="item.proportion"  style="width:217px;" placeholder="请输入百分比" ></el-input>
                                       </el-form-item>
                               </div>
                               <div class="contract-item">
                                       <el-form-item label="收/付款日期：" label-width="180px">
                                               <el-date-picker
                                                    v-model="item.operationDate"
                                                    type="date"
                                                    value-format="yyyy-MM-dd"
                                                    placeholder="请选择合收/付款日期" :disabled="type=='look'">
                                            </el-date-picker>
                                       </el-form-item>
                                       <el-form-item label="含税金额（元）：" label-width="180px">
                                               <el-input v-model="item.amount"  style="width:217px;" disabled></el-input>
                                       </el-form-item>
                               </div>
                               <div class="contract-item">
                                       <el-form-item label="税率（%）：" label-width="180px">
                                               <el-input v-model="item.taxRate"  style="width:217px;" disabled></el-input>
                                       </el-form-item>
                                       <el-form-item label="不含税金额（元）：" label-width="180px">
                                               <el-input v-model="item.payAmount"  style="width:217px;" disabled></el-input>
                                       </el-form-item>
                               </div>
                               <div class="contract-item">
                                       <el-form-item label="税金（元）：" label-width="180px">
                                               <el-input v-model="item.taxAmount"  style="width:217px;" disabled></el-input>
                                       </el-form-item>
                               </div>
                               <el-button type="primary" class="del"  v-if="ruleFormParam1.planRequests.length>1 && type != 'look' " >删除</el-button>
                       </div>
                       <el-button type="primary"  v-if="type !=='look'">增加收/付款节点</el-button>
                       <div style="text-align:center;">
                               <el-button type="primary" @click="secondPrev">上一步</el-button>
                               <el-button type="primary" @click="secondNext">下一步</el-button>
                       </div>
               </el-form>
               <div class="thirdStep" v-if="active==3" style="font-size:14px;">
                        <div style="display:flex;align-items:center;margin-top:20px;">
                                <p style="margin:0;">合同文本：</p>

                        </div>
                        <p>支持扩展名：.doc .docx .pdf</p>
                        <el-table :data="thirdTxtData">
                                <el-table-column label="序号" type="index" width="50" align="center"></el-table-column>
                                <el-table-column label="文件名称" prop="fileName" align="center"></el-table-column>
                                <el-table-column label="上传文件名" prop="fileUploadName" align="center"></el-table-column>
                                <el-table-column label="创建人" prop="createUserName" align="center"></el-table-column>
                                <el-table-column label="上传时间" prop="createTimeStr" align="center"></el-table-column>
                                <el-table-column label="操作"  align="center">
                                        <template slot-scope="scope">
                                                <el-button type="text" size="small" @click="modifyName('txt',scope.$index)" v-if="(status==0)||(status==3)||(status==4)||(status==8)||(status==13)||(status==14)||(status==15)">修改文件名</el-button>
                                                <el-button type="text" size="small" @click="down(scope.$index)">下载</el-button>
                                                <el-button type="text" size="small" :disabled="scope.row.fileUploadName.substring(scope.row.fileUploadName.lastIndexOf('.')+1,scope.row.fileUploadName.length) != 'pdf'" @click="previewPdf(scope.row.fileAddress)">PDF预览</el-button>
                                                <el-button type="text" size="small" @click="delItem('txt',scope.$index)" v-if="(status==0)||(status==3)||(status==4)||(status==8)||(status==13)||(status==14)||(status==15)">删除</el-button>
                                        </template>
                                </el-table-column>
                        </el-table>
                        <div style="display:flex;align-items:center;margin-top:200px;">
                                <p style="margin:0;">合同附件：</p>

                        </div>
                        <p>支持扩展名：.doc .docx .pdf</p>
                        <el-table :data="thirdEnclosureData" border stripe>
                                <el-table-column label="序号" type="index" width="50" align="center"></el-table-column>
                                <el-table-column label="文件名称" prop="fileName" align="center"></el-table-column>
                                <el-table-column label="上传文件名" prop="fileUploadName" align="center"></el-table-column>
                                <el-table-column label="创建人" prop="createUserName" align="center"></el-table-column>
                                <el-table-column label="上传时间" prop="createTimeStr" align="center"></el-table-column>
                                <el-table-column label="操作"  align="center">
                                        <template slot-scope="scope">
                                                <el-button type="text" size="small" @click="modifyName('mod',scope.$index)" v-if="(status==0)||(status==3)||(status==4)||(status==8)||(status==13)||(status==14)||(status==15)">修改文件名</el-button>
                                                <el-button type="text" size="small" @click="down(scope.$index)">下载</el-button>
                                                <el-button type="text" size="small" :disabled="scope.row.fileUploadName.substring(scope.row.fileUploadName.lastIndexOf('.')+1,scope.row.fileUploadName.length) != 'pdf'" @click="previewPdf(scope.row.fileAddress)">PDF预览</el-button>
                                                <el-button type="text" size="small" @click="delItem('mod',scope.$index)" v-if="(status==0)||(status==3)||(status==4)||(status==8)||(status==13)||(status==14)||(status==15)">删除</el-button>
                                        </template>
                                </el-table-column>
                        </el-table>
                        <div style="text-align:center;margin-top:25px;">
                                <el-button type="primary" @click="thirdPrev">上一步</el-button>
                                <el-button type="primary" @click="launchApproval(1)" v-if="(status==0)||(status==3)||(status==4)||(status==8)||(status==13)||(status==14)||(status==15)">发起审批</el-button>
                                <el-button type="primary" @click="returnList(0)" v-if="type !='look' && type !='change'">保存</el-button>
                                <el-button type="primary" @click="closeCurrentPage" v-if="type =='look'">关闭</el-button>
                        </div>
               </div>

        </div>
</template>

<script>
import createCoop from "../common/createCooproject"
import api from '@/api/apiPath'
export default {
        data(){
                return {
                        source:this.$route.query.source,//查看详情来源
                        contractProvinceName:"",//新建时自动带出来的省份
                        contractCityName:"",//新建时自动带出来的城市
                        provinces:[],//新建项目的省份
                        citys:[],//新建项目的城市
                        developers:[],//新建项目的开发商
                        type:this.$route.query.type,
                        status:"",//判断合同状态以便于是否显示发起审批按钮
                        active:1,
                        placeHoldcontractSummary:"",//合同概述placeholder
                        placeHoldcontractProvisions:"",//关键条款placeholder.
                        textmodify:"",//第三步编辑文件名
                        modifydialogVisible:false,//第三步编辑文件名
                        modifyindex:"",//第三步编辑文件名
                        modifytype:"",//第三步编辑文件名(是文本还是附件)
                        Qindex:"",//表示哪一个签约方
                        contractnatures:[//第一步相关
                                // {value:1,label:"框架合同"},{value:2,label:"主合同"},{value:3,label:"分合同"},
                        ],
                        budgetcategorys:[//第一步相关
                                // {value:1,label:"收入类"},{value:2,label:"支出类"}
                        ],
                        contractcategorys:[//第一步相关
                                {value:1,label:"开发商类"},{value:2,label:"渠道商类"}
                        ],
                        pickerOption:{//第一步相关
                                disabledDate(time) {
                                        return time.getTime() < Date.now()- 8.64e7;
                                }
                        },
                        provinces:[],//第一步相关
                        citys:[],//第一步相关
                        contractingcategorys:[//第一步相关
                                // {value:1,label:"收款方"},{value:2,label:"付款方"},{value:3,label:"丙方"}
                        ],
                        contractPartyresources:[//第一步相关
                                // {value:1,label:"内部法人单位"},{value:2,label:"渠道/经纪"},{value:3,label:"开发商"}
                        ],
                        contractTemplates:[//第一步相关
                                {value:0,label:"是"},{value:1,label:"否"}
                        ],
                        callModels:[//第一步相关

                        ],
                        thirdTxtData:[],//第三步合同文本集合
                        thirdEnclosureData:[],//第三步合同附件集合
                        choseCompanyVisible:false,//选择内部法人弹框的boolean
                        choseCompany:"",//选择内部法人的字段
                        choseCompanyData:[],//选择内部法人的数据
                        choseCompanyRadio:"",//选择内部法人的单选
                        contractCompanyTotal:0,//内部法人的总条数
                        choseCompanyParams:{//内部法人的参数
                                pageNum:1,
                                pageSize:10,
                                companyName:""
                        },
                        choseCompanySelected:{},//选择内部法人单选的数据

                        choseBrokerVisible:false,//选择渠道/经纪弹框的boolean
                        choseBroker:"",//选择渠道/经纪的字段
                        choseBrokerData:[],//选择渠道/经纪的数据
                        choseBrokerRadio:"",//选择渠道/经纪的单选
                        contractBrokerTotal:0,//渠道/经纪的总条数
                        choseBrokerParams:{//渠道/经纪的参数
                                pageNum:1,
                                pageSize:10,
                                companyName:""
                        },
                        choseBrokerSelected:{},//选择渠道/经纪单选的数据

                        choseDevelpVisible:false,//选择开发商
                        choseDevelp:"",//选择开发商的字段
                        choseDevelpData:[],//选择开发商的数据
                        choseDevelpRadio:"",//选择开发商的单选
                        contractDevelpTotal:0,//开发商的总条数
                        choseDevelpParams:{//开发商的参数
                                pageNum:1,
                                pageSize:10,
                                companyName:""
                        },
                        choseDevelpSelected:{},//选择开发商单选的数据

                        choseOpenbankVisible:false,////选择开户行
                        choseOpenbank:"",//选择开户行的字段
                        choseOpenbankData:[],//选择开开户行的数据
                        choseOpenbankRadio:"",//选择开户行的单选
                        choseOpenbankSelected:{},//选择开户行单选的数据

                        choseChargePersonVisible:false,//选择经办人的boolean
                        ChargePersonParam:{//选择经办人
                                userName:"",//姓名
                                jobNumber:"",//工号
                                mobile:"",//手机号
                                pageNum:1,
                                pageSize:10
                        },
                        contractOperatorTotal:0,//经办人总条数
                        choseChargePersonData:[],
                        choseChargePersonRadio:"",//选择经办人的单选
                        choseChargePersonSelected:{},//选择经办人单选的数据

                        choseCooprojectVisible:false,//选择合作项目的boolean
                        choseCooprojectPageNum:1,//选择合作项目的分页
                        choseCooprojectPageSize:10,//选择合作项目的分页
                        choseCooprojectRadio:-1,//选择合作项目的单选按钮
                        choseCooprojectSelected:{},//选择合作项目的单选的数据
                        nameproject:"",//选择合作项目的项目名称仅做展示用
                        choseCooprojectTotal:0,//选择合作项目的总条数
                        choseCooprojectData:[],//选择合作项目的数据
                        changeFormParam:{//变更合同的参数
                                updateContent:"",
                                updateReason:"",
                                contractId:this.$route.query.contractId,
                                contractCode:""
                        },
                        changeData:[],//合同变更的数据
                        changeRules:{
                                updateContent:[
                                        {required: true, message: '请输入变更内容', trigger: 'blur'}
                                ],
                                updateReason:[
                                        {required: true, message: '请输入变更原因', trigger: 'blur'}
                                ]
                        },
                        ruleFormParam:{
                                contractName:"",//合同名称
                                id:"",
                                oldContractId:"",//变更时使用
                                contractCode:"",//合同编号
                                contractType:"",//合同类型
                                budgetType:"",//收支类别
                                contractNature:"",//合同性质
                                contractEndTime:"",//合同截止日期
                                contractProvince:"",//合同归属省
                                contractCity:"",//合同归属市
                                contractSummary:"",//合同概述
                                contractProvisions:"",//关键条款
                                partiesList:[//签约方信息
                                        {
                                                partiesType:"",//签约方类别
                                                partiesSource:"",//签约方数据源
                                                companyId:"",//公司/个人名称
                                                companyName:"",
                                                bankId:"",//开户行
                                                bankName:"",//开户行名称

                                                lawperson:"",//法定代表人
                                                openingBank:"",//开户行
                                                openbankName:"",//开户行名称
                                                idCard:"",//纳税人识别号或身份证
                                                openbankNum:"",//银行账号
                                                lineNum:"",//联行号
                                                districtInfo:"",//地区代码信息
                                                openBankprovince:"",//开户行所属省
                                                companyDistrict:"",//公司地址
                                                openBankcity:"",//开户行所属市
                                                contacttel:"",//联系电话
                                                postCode:"",//邮政编码
                                                purpose:""//用途
                                        }
                                ],
                                projectId:"",//项目名称
                                contractOperatorName:"",//经办人姓名
                                contractOperatorUserid:"",//经办人id
                                contractOperatorPhone:"",//联系电话
                                templateFlag:0,//是否合同范本
                                templateReason:"",//不用合同范本的原因
                                templateIds:[],//是范本的集合
                                remarks:"",//备注
                                discardReason:"",//作废原因
                        },
                        ruleFormParam1:{//第二步参数
                                contractAmountStr:"0",//含税金额
                                id:"",
                                oldContractId:"",//变更时使用
                                taxRateStr:"",//税率
                                taxAmountStr:"0",//税金
                                accountsPayableStr:"0",//不含税金额
                                planRequests:[//合同履约计划
                                        {
                                                nodeName:"",//节点名称
                                                proportion:"",//百分比
                                                operationDate:"",//收付款日期
                                                amount:"0",//含税金额
                                                taxRate:"",//税率
                                                payAmount:"0",//不含税金额
                                                taxAmount:"0"//税金
                                        }
                                ]
                        },
                        ruleFormParam2:{//第三步参数
                                id:"",
                                oldContractId:"",//变更时使用
                                status:"",
                                fileList:[]
                        },
                        rules:{
                                contractName:[
                                        {required: true, message: '请输入合同名称', trigger: 'blur'}
                                ],
                                contractType:[
                                        {required: true, message: '请选择合同类型', trigger: 'change'}
                                ],
                                budgetType:[
                                        {required: true, message: '请选择收支类别', trigger: 'change'}
                                ],
                                contractNature:[
                                        {required: true, message: '请选择合同性质', trigger: 'change'}
                                ],
                                contractEndTime:[
                                        {required: true, message: '请选择截止日期', trigger: 'change'}
                                ],
                                contractProvince:[
                                        {required: true, message: '请选择归属城市', trigger: 'change'}
                                ],
                                contractSummary:[
                                        {required: true, message: '请输入合同概述', trigger: 'blur'}
                                ],
                                contractProvisions:[
                                        {required: true, message: '请输入关键条款', trigger: 'blur'}
                                ],
                                contractOperatorName:[
                                        {
                                                required:true,
                                                validator: (rule, value, callback) => {
                                                    if(value==""){
                                                            return callback(new Error('请选择经办人'));
                                                    }
                                                    callback();
                                                }
                                        }
                                ],
                                contractOperatorPhone:[
                                        {
                                                required:true,
                                                validator: (rule, value, callback) => {
                                                    if(value==""){
                                                            return callback(new Error('请输入联系电话'));
                                                    }
                                                    var reg = /^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|16[0|1|2|3|5|6|7|8|9]|17[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9]|19[0|1|2|3|5|6|7|8|9])\d{8}$/;
                                                    if(!reg.test(value)){
                                                            return callback(new Error('请输入正确的联系电话'));
                                                    }
                                                    callback();
                                                }
                                        }
                                ],
                                templateFlag:[{required: true, message: '请选择是否是范本', trigger: 'change'}]
                        }
                }
        },
        methods:{

                initContractInfo(){//初始化合同信息（查看或者编辑或者变更）
                        this.axios.get(api.CONTRACTLOOK+"/"+this.$route.query.contractId).then((res)=>{
                                if(res.data.code==200){
                                        let result=res.data.data;
                                        this.status=result.status;
                                        this.ruleFormParam.id=result.id;
                                        this.ruleFormParam1.id=result.id;
                                        this.ruleFormParam2.id=result.id;
                                        // 第一步赋值
                                        this.ruleFormParam.contractName=result.contractName;
                                        this.ruleFormParam.contractCode=result.contractCode;
                                        this.ruleFormParam.contractType=result.contractType.toString();
                                        this.ruleFormParam.budgetType=result.budgetType;
                                        this.ruleFormParam.contractNature=result.contractNature;
                                        this.ruleFormParam.contractEndTime=result.contractEndTime;
                                        this.ruleFormParam.contractProvince=Number(result.contractProvince);
                                        this.loadCity(result.contractProvince).then(()=>{
                                                this.ruleFormParam.contractCity=Number(result.contractCity);
                                        });
                                        this.ruleFormParam.contractSummary=result.contractSummary;
                                        this.ruleFormParam.contractProvisions=result.contractProvisions;
                                        this.ruleFormParam.partiesList=result.partiesList;
                                        this.ruleFormParam.projectId=result.projectId;
                                        this.nameproject= result.project ? result.project.projectName: '';
                                        this.ruleFormParam.contractOperatorName=result.contractOperatorName;
                                        this.ruleFormParam.contractOperatorUserid=result.contractOperatorUserid;
                                        this.ruleFormParam.contractOperatorPhone=result.contractOperatorPhone;
                                        this.ruleFormParam.templateFlag=result.templateFlag;
                                        if(result.templateRelList.length){
                                                for(var i=0;i<result.templateRelList.length;i++){
                                                        this.ruleFormParam.templateIds.push(result.templateRelList[i].templateId);
                                                }
                                        }
                                        this.ruleFormParam.templateReason=result.templateReason;
                                        this.ruleFormParam.remarks=result.remarks;
                                        this.ruleFormParam.discardReason=result.discardReason;
                                        // 第二步赋值
                                        if(result.contractAmount != null){
                                                this.ruleFormParam1.contractAmountStr=this.toFixedFn(result.contractAmount);
                                        }else{
                                                this.ruleFormParam1.contractAmountStr=""
                                        }
                                        if(result.taxRate != null){
                                                this.ruleFormParam1.taxRateStr=this.toFixedFn(result.taxRate);
                                        }else{
                                                this.ruleFormParam1.taxRateStr=""
                                        }

                                        this.ruleFormParam1.taxAmountStr=this.toFixedFn(result.taxAmount);
                                        this.ruleFormParam1.accountsPayableStr=this.toFixedFn(result.accountsPayable);
                                        for(let i=0;i<result.planList.length;i++){
                                                delete result.planList[i].contractId;
                                                delete result.planList[i].createTime;
                                                delete result.planList[i].id;
                                                delete result.planList[i].updateTime;
                                                if(result.planList[i].proportion==null){
                                                        result.planList[i].proportion=""
                                                }
                                        }
                                        this.ruleFormParam1.planRequests=result.planList;
                                        // 第三步赋值
                                        for(var i=0;i<result.fileList.length;i++){
                                                if(result.fileList[i].fileType==0){
                                                        this.thirdTxtData.push(result.fileList[i]);
                                                }else{
                                                        this.thirdEnclosureData.push(result.fileList[i]);
                                                }
                                        }
                                        this.loadTemplateRel(this.ruleFormParam.contractType);
                                }
                        }).catch((error)=>{
                                console.log(error);
                        })
                },

                initSelect(){//初始化下拉数据
                        this.axios.get(api.INITSELECT).then((res)=>{
                                if(res.data.code==200){
                                        this.budgetcategorys=res.data.data.budgetTypes;
                                        this.contractnatures=res.data.data.contractNatrues;
                                        this.contractingcategorys=res.data.data.contractParties;
                                        this.contractPartyresources=res.data.data.contractPartiesSource;
                                        // this.provinces=res.data.data.provinces;
                                        this.ruleFormParam.contractProvince=res.data.data.provinces[0].provinceid;
                                        this.ruleFormParam.contractCity=res.data.data.provinces[0].cityId;
                                        this.contractProvinceName=res.data.data.provinces[0].province;
                                        this.contractCityName=res.data.data.provinces[0].city;
                                        this.contractcategorys=res.data.data.userContractType;
                                }
                        }).catch((error)=>{
                                console.log(error)
                        })
                },
                loadCity(provinceid){//省市级联
                        return this.axios.get(api.INITCITYLIST+"/"+this.ruleFormParam.contractProvince).then((res)=>{
                               if(res.data.code==200){
                                       this.ruleFormParam.contractCity="";
                                       this.citys=res.data.data;
                               }
                        }).catch((error)=>{
                                console.log(error)
                        })
                },

                loadTemplateRel(contractType){//加载范本
                        this.axios.post(api.GETTEMPLATE,{pageNum:1,pageSize:5,status:1,contractType:contractType}).then((res)=>{
                              if(res.data.code==200){
                                      let result=res.data.data.list
                                      this.callModels=[];
                                     for(let i=0;i<result.length;i++){
                                             this.callModels.push({templateId:result[i].id,templateName:result[i].templateName,templateEnclosure:result[i].templateEnclosure})
                                     }
                              }
                        }).catch((error)=>{
                                console.log(error)
                        })
                },

                toFixedFn(value){//保留两位小数并且千分位展示
                        if(value !=undefined && value.toString()!="" && value !=null){
                                return value.toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g,",");
                        }
                },
                reductionFn(value){//还原千分位
                        if(value!=""){
                                return value.replace(/,/g,'');
                        }
                },
                warn(msg) {
                        this.$alert(msg, '提示', {
                                type: 'error',
                                confirmButtonText: '确定',
                                callback: action => {
                                }
                        });
                },

                firstNext(){//第一步的下一步操作
                         if(this.type=="look"){
                                 this.active++
                         }else{
                                 this.$refs['ruleForm'].validate((valid)=>{
                                         if(!valid){
                                                 return
                                         }
                                         var templist=[];
                                         for(let i=0;i<this.ruleFormParam.partiesList.length;i++){
                                                 templist.push(this.ruleFormParam.partiesList[i].partiesType)
                                                 if(this.ruleFormParam.partiesList[i].partiesType.toString()=="" || this.ruleFormParam.partiesList[i].partiesSource.toString()=="" || this.ruleFormParam.partiesList[i].companyId.toString()=="" || this.ruleFormParam.partiesList[i].bankName==""){
                                                         this.warn("请完善第"+(i+1)+"个签约方信息");
                                                         return;
                                                 }
                                         }
                                         templist=Array.from(new Set(templist))
                                         if(templist.length != this.ruleFormParam.partiesList.length){
                                                 this.warn("请勿重复添加签约方信息");
                                                 return;
                                         }
                                         if(!(this.ruleFormParam.contractType ==100002 && this.ruleFormParam.contractNature ==0)){
                                                 if(this.ruleFormParam.projectId==""){
                                                         this.warn("请选择项目");
                                                         return;
                                                 }
                                         }
                                         if(this.ruleFormParam.templateFlag==0&&!this.ruleFormParam.templateIds.length){
                                                 this.warn("请勾选要调用的合同范本");
                                                 return;
                                         }
                                         if(this.ruleFormParam.templateFlag==1&&this.ruleFormParam.templateReason==""){
                                                 this.warn("请输入不用合同范本的原因");
                                                 return;
                                         }
                                         this.axios.post(api.SAVEFIRST,this.ruleFormParam).then((res)=>{
                                                 if(res.data.code==200){
                                                         this.ruleFormParam.id=res.data.data.contractId;
                                                         this.ruleFormParam1.id=res.data.data.contractId;
                                                         this.ruleFormParam2.id=res.data.data.contractId;
                                                         this.loadContractfile(res.data.data.contractId);
                                                         this.active++;
                                                 }
                                         }).catch((error)=>{
                                                 console.log(error);
                                         });

                                 })
                         }
                },

                secondPrev(){//第二步的上一步操作
                        this.active--
                },
                secondNext(){//第二步的下一步操作
                        if(this.type=="look"){
                                this.active++
                        }else{
                                var sum=0;
                                var sum1=0;
                                var totalsum;
                                let reg = /^([0-9][0-9]*)+(\.[0-9]{1,2})?$/;
                                if(this.ruleFormParam1.contractAmountStr<0){
                                        this.warn("合同费用信息下的含税金额不能为负值");
                                        return;
                                }
                                if(this.ruleFormParam1.contractAmountStr !="" && !reg.test(this.ruleFormParam1.contractAmountStr)){
                                        this.warn("合同费用信息下的含税金额，限数字最多保留两位小数");
                                        return;
                                }
                                if(this.ruleFormParam1.taxRateStr<0){
                                        this.warn("合同费用信息下的税率不能为负值");
                                        return;
                                }
                                if(this.ruleFormParam1.taxRateStr !="" && !reg.test(this.ruleFormParam1.taxRateStr)){
                                        this.warn("合同费用信息下的税率，限数字最多保留两位小数");
                                        return;
                                }
                                if(this.ruleFormParam1.taxRateStr>100){
                                        this.warn("合同费用信息下的税率不能大于100");
                                        return;
                                }
                                for(var i=0;i<this.ruleFormParam1.planRequests.length;i++){
                                        if(this.ruleFormParam1.planRequests[i].proportion.toString() != ""){
                                                if(this.ruleFormParam1.planRequests[i].proportion<0){
                                                        this.warn("合同履约计划下第"+(i+1)+"个收付款百分比不能为负值");
                                                        return
                                                }
                                                if(this.ruleFormParam1.planRequests[i].proportion>100){
                                                        this.warn("合同履约计划下第"+(i+1)+"个收付款百分比不能大于100");
                                                        return
                                                }
                                                if( !reg.test(this.ruleFormParam1.planRequests[i].proportion)){
                                                        this.warn("输入正确的第"+(i+1)+"个收付款百分比");
                                                        return
                                                }
                                                sum+=parseFloat(this.ruleFormParam1.planRequests[i].proportion)
                                        }else {
                                                sum1=0
                                        }
                                        totalsum=sum+sum1;
                                        console.log(totalsum);
                                }
                                if(totalsum != 100 && totalsum !=0){
                                        this.warn("合同履约计划百分比总数需为100");
                                        return
                                }
                                this.axios.post(api.SAVESECOND,this.ruleFormParam1).then((res)=>{
                                        if(res.data.code==200){
                                                this.active++;
                                                console.log(res.data);
                                        }
                                }).catch((error)=>{
                                        console.log(error);
                                });

                        }
                },

                uploadSuccess(url,filename){
                        let tempobj={
                                fileType:0,
                                fileName:filename,
                                fileUploadName:filename,
                                fileAddress:url,
                                createTimeStr:"",
                                creeateUserName:""
                        }
                        this.thirdTxtData.push(tempobj);
                },
                uploadSuccess1(url,filename){
                        let tempobj={
                                fileType:1,
                                fileName:filename,
                                fileUploadName:filename,
                                fileAddress:url,
                                createTimeStr:"",
                                creeateUserName:""
                        }
                        this.thirdEnclosureData.push(tempobj);
                },
                previewPdf(url){//PDF预览
                        window.open(encodeURI(url), "_blank");
                },
                delItem(type,index){//删除合同附件
                        console.log(type)
                        this.$confirm("此操作将删除该条记录, 是否继续?","提示",{
                                confirmButtonText: '确定',
                                cancelButtonText: '取消',
                                type: 'warning'
                        }).then(()=>{
                                this.$alert("操作成功", '提示', {
                                        type: 'success ',
                                        confirmButtonText: '确定',
                                        callback: action => {
                                                if(type=="txt"){
                                                        this.thirdTxtData.splice(index,1)
                                                }else{
                                                        this.thirdEnclosureData.splice(index,1)
                                                }

                                        }
                                });
                        }).catch(()=>{})
                },
                modifyName(type,index){//修改文件名
                        this.modifytype=type;
                        this.modifyindex=index;
                        this.modifydialogVisible=true;
                },
                modifySave(){//确认修改文件名
                        if(this.textmodify==""){
                                this.warn("请输入文件名");
                                return
                        }
                        if(this.modifytype=="txt"){
                                let originFilename=this.thirdTxtData[this.modifyindex].fileName;
                                let Suffixname=originFilename.substring(originFilename.lastIndexOf(".")+1,originFilename.length);
                                this.thirdTxtData[this.modifyindex].fileName=this.textmodify+"."+Suffixname;
                        }else{
                                let originFilename=this.thirdEnclosureData[this.modifyindex].fileName;
                                let Suffixname=originFilename.substring(originFilename.lastIndexOf(".")+1,originFilename.length);
                                this.thirdEnclosureData[this.modifyindex].fileName=this.textmodify+"."+Suffixname;
                        }

                        this.modifydialogVisible=false;
                        this.textmodify="";
                },
                modifycancel(){//取消修改文件名
                        this.modifydialogVisible=false;
                        this.textmodify="";
                },
                down(index){//下载文件
                        window.open(this.thirdEnclosureData[index].fileAddress, "_blank");
                },
                thirdPrev(){
                        this.active--;
                },
                savethird(status,fileList){//第三步的save
                        this.ruleFormParam2.status=status;
                        this.ruleFormParam2.fileList=fileList;
                        this.axios.post(api.SAVETHIRD,this.ruleFormParam2).then((res)=>{
                                if(res.data.code==200){
                                        this.$alert("操作成功", '提示', {
                                                type: 'success ',
                                                confirmButtonText: '确定',
                                                callback: action => {
                                                        this.$router.push({
                                                                path:"/contractlist"
                                                        })
                                                }
                                        });
                                }
                        }).catch((error)=>{
                                console.log(error);
                        });
                },
                launchApproval(status){//第三步发起审批
                        let fileList=this.thirdTxtData.concat(this.thirdEnclosureData);
                        this.savethird(status,fileList)
                },
                returnList(status){//第三步保存
                        let fileList=this.thirdTxtData.concat(this.thirdEnclosureData);
                        this.savethird(status,fileList)
                },

                closeCurrentPage(){//查看详情第三步关闭
                        this.$router.push({
                                path:"/contractaddoredit",
                                query:{
                                        type:"change",
                                        contractId:this.$route.query.conid
                                }
                        })
                },
                initTime(row, column, cellValue, index){
                        return this.getTimeString(cellValue)
                },
                getTimeString (timestamp) {//初始化时间
                        if (timestamp) {
                                const time = new Date(timestamp)
                                let dateStr = ''
                                const year = time.getFullYear()
                                const month = String(time.getMonth() + 1).length === 1 ? '0' + (time.getMonth() + 1) : (time.getMonth() + 1)
                                const day = String(time.getDate()).length === 1 ? '0' + time.getDate() : time.getDate()
                                dateStr = year + '-' + month + '-' + day
                                let timeStr = ''
                                const hours = time.getHours()
                                const hh = String(hours).length === 1 ? '0' + hours : hours
                                const minutes = time.getMinutes()
                                const mm = String(minutes).length === 1 ? '0' + minutes : minutes
                                const seconds = time.getSeconds()
                                const ss = String(seconds).length === 1 ? '0' + seconds : seconds
                                timeStr = `${hh}:${mm}:${ss}`
                                // timeStr = `${hh}:${mm}`
                                return dateStr + ' ' + timeStr
                                // return dateStr
                        } else {
                                return ''
                        }
                },

        },
        mounted(){
                this.initSelect();
                if(this.type=="look" || this.type=="edit" || this.type=="change"){
                        this.initContractInfo();
                }
        },
        components:{
            createCoop
        }
}
</script>

<style lang="stylus" >
        .contract-add-edit{
                .steps{
                        .stepbtn{
                                width: 126px;
                                height: 40px;
                                font-size: 14px;
                                border-radius: 4px;
                                display: inline-block;
                                margin-right: 15px;
                                color: #606266;
                                text-align: center;
                                line-height: 40px;
                                border: 1px solid #DCDFE6;
                        }
                        .stepbtn.on{
                                background:#409EFF;
                                color: #fff;
                                border-color: #409EFF;
                        }
                }
                .title{
                        font-size: 18px;
                        margin-top: 40px;
                        font-weight: bold;
                }
                .contract-item{
                        margin: 20px 0;
                }
                .inputtextarea{
                        display: block !important;
                        .el-form-item__content{
                                width: 60%;
                        }
                }
                .contractBody{
                        position: relative;
                        .del{
                                position: absolute;
                                top: 50%;
                                right: 20%;
                                transform: translateY(-50%);
                        }
                }
                .commonclass .el-form-item__label:before{
                        content: '*';
                        color: #f56c6c;
                        margin-right: 2px;
                }
                .el-table .cell{
                        white-space:nowrap !important;
                }
                .changeContract{
                        .el-form-item{
                                width: 100%;
                        }
                        .el-form-item__content{
                                width: 70%;
                        }
                }
        }
</style>
